<template>
  <div>
    <button @click="addAddfn">加一</button>
    <div>一辆汽车{{ car.brand }}车，价格{{ car.price }}</div>
  </div>
</template>
<script setup lang="ts"  name= "person555">
import { reactive } from "vue"; //复杂数据类型引入响应式方式，简单数据类型复杂数据类型底层代理方式不同  console.log("响应式", car);这里可以看出来,
let arr = reactive([1, 5, 6]);
let car = reactive({ brand: "奔驰", price: 100 }); //模板template，里面直接拿就行啦 
console.log("响应式", car); //目前打印这个数据已经不单纯啦  他已经成相应势的啦。他是个对象  
function addAddfn() {
  car.price = car.price + 10; //复杂数据类行不需要加value  目前已经实现响应式啦
  console.log("666", car);
}
//总结复杂数据类型只要被reactive包裹 不管数据数据多深 都可以被监听到 解决了vue中$set的问题
</script>